<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="vue.js"></script>
	</head>
	<body>
		<div id="app">
			<!-- {{插值写法:要求要有返回值,不然就会报错。}} -->
			{{1}}
			{{'我是内容'}}
			{{ {name:"刘毅"} }}
			{{[1,2,3]}}
			{{true}}
			{{ (function() {return 150})() }}
			<!-- 值类型:数字，字符串，布尔值，对象，数组，返回值的函数调用。表达式 -->
			{{1+1}}
			<!-- 插值写法等价于v-text -->
			<h1 v-text="msg+txt"></h1>
			<h2 v-text="100*100"></h2>
			<!-- v-text和{{}}都只是渲染文本 innerText-->
			<!-- v-html渲染字符串类型的dom片段。留言系统，小说详情等 -->
			<div v-html="strDom"></div>
		</div>
	</body>
	<script>
		new Vue({
			el:'#app',
			data:{
				strDom:"<h1>刘毅</h1>",
				msg:`我是一个内容`,
				txt:"另外的一个内容"
			}
		})
	</script>
</html>
